<template>
	<view class="row typeSixteenWrap">
		<view v-for="(item, index) in list"  :key="item.productClusterId" class="row listWrap">
			<view :style="{width: '23rpx',height: '10rpx'}" v-if="list.length >= 1 && index == 0"></view>
			<product-item-three
				style="width: 220rpx;background-color: #FFFFFF;"
				:src="item.thumbnail"
				:dSrc="item.promotions ? item.promotions[0].picturesUrl : null"
				:title="item.title"
				:titleLabel="item.promotions ? item.promotions[0].label : null"
				:discount="item.discount"
				:originalPrice="item.originalPriceString ? '¥' + item.originalPriceString : null"
				:price="item.priceString ? '¥' + item.priceString : null"
				:entrance="item.entrance"
			/>
			<view :style="{width: '23rpx',height: '10rpx'}" v-if="list.length > 1 && ((index + 1) != list.length)"></view>
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			list: {
				type: Array,
				default: () => []
			}
		},
		data() {
			return {
				
			};
		},
	}
</script>

<style>
	.typeSixteenWrap {
		/* #ifdef H5 || MP-WEIXIN */
		display: flex;
		/* #endif */
		flex-direction: row;
		margin-top: 10rpx;
		margin-bottom: 10rpx;
	}
	.listWrap {
		/* #ifdef H5 || MP-WEIXIN */
		display: flex;
		/* #endif */
		flex-direction: row;
	}
</style>
